<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>滇宏教育-首页</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <link rel="stylesheet" href="../css/public.css" media="all">
    <style>
        .layui-card {border:1px solid #f2f2f2;border-radius:5px;}
        .icon {margin-right:10px;color:#1aa094;}
        .icon-cray {color:#ffb800!important;}
        .icon-blue {color:#1e9fff!important;}
        .icon-tip {color:#ff5722!important;}
        .layuimini-qiuck-module {text-align:center;margin-top: 10px}
        .layuimini-qiuck-module a i {display:inline-block;width:100%;height:60px;line-height:60px;text-align:center;border-radius:2px;font-size:30px;background-color:#F8F8F8;color:#333;transition:all .3s;-webkit-transition:all .3s;}
        .layuimini-qiuck-module a cite {position:relative;top:2px;dis play:block;color:#666;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:14px;}
        .welcome-module {width:100%;height:210px;}
        .panel {background-color:#fff;border:1px solid transparent;border-radius:3px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px rgba(0,0,0,.05)}
        .panel-body {padding:10px}
        .panel-title {margin-top:0;margin-bottom:0;font-size:12px;color:inherit}
        .label {display:inline;padding:.2em .6em .3em;font-size:75%;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25em;margin-top: .3em;}
        .layui-red {color:red}
        .main_btn > p {height:40px;}
        .layui-bg-number {background-color:#F8F8F8;}
        .layuimini-notice:hover {background:#f6f6f6;}
        .layuimini-notice {padding:7px 16px;clear:both;font-size:12px !important;cursor:pointer;position:relative;transition:background 0.2s ease-in-out;}
        .   layuimini-notice-title,.layuimini-notice-label {
            padding-right: 70px !important;text-overflow:ellipsis!important;overflow:hidden!important;white-space:nowrap!important;}
        .layuimini-notice-title {line-height:28px;font-size:14px;}
        .layuimini-notice-extra {position:absolute;top:50%;margin-top:-8px;right:16px;display:inline-block;height:16px;color:#999;}
    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md8">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-card">
                            <div class="layui-card-header"><i class="fa fa-warning icon"></i>数据统计</div>
                            <div class="layui-card-body">
                                <div class="welcome-module">
                                    <div class="layui-row layui-col-space10">
                                        <div class="layui-col-xs6">
                                            <div class="panel layui-bg-number">
                                                <div class="panel-body">
                                                    <div class="panel-title">
                                                        <span class="label pull-right layui-bg-blue">实时</span>
                                                        <h5>用户统计</h5>
                                                    </div>
                                                    <div class="panel-content">
                                                        <h1 class="no-margins" id="userCount"></h1>
                                                        <small>当前总记录数</small>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-col-xs6">
                                            <div class="panel layui-bg-number">
                                                <div class="panel-body">
                                                    <div class="panel-title">
                                                        <span class="label pull-right layui-bg-cyan">实时</span>
                                                        <h5>学生统计</h5>
                                                    </div>
                                                    <div class="panel-content">
                                                        <h1 class="no-margins" id="studentCount"></h1>
                                                        <small>当前总记录数</small>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-col-xs6">
                                            <div class="panel layui-bg-number">
                                                <div class="panel-body">
                                                    <div class="panel-title">
                                                        <span class="label pull-right layui-bg-orange">实时</span>
                                                        <h5>教师统计</h5>
                                                    </div>
                                                    <div class="panel-content">
                                                        <h1 class="no-margins" id="teacherCount"></h1>
                                                        <small>当前总记录数</small>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-col-xs6">
                                            <div class="panel layui-bg-number">
                                                <div class="panel-body">
                                                    <div class="panel-title">
                                                        <span class="label pull-right layui-bg-green">实时</span>
                                                        <h5>班级统计</h5>
                                                    </div>
                                                    <div class="panel-content">
                                                        <h1 class="no-margins" id="courseCount"></h1>
                                                        <small>当前总记录数</small>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-card">
                            <div class="layui-card-header"><i class="fa fa-credit-card icon icon-blue"></i>快捷入口</div>
                            <div class="layui-card-body">
                                <div class="welcome-module">
                                    <div class="layui-row layui-col-space10 layuimini-qiuck">
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/userList.html" data-title="用户管理" data-icon="fa fa-window-maximize">
                                                <i class="fa fa-window-maximize"></i>
                                                <cite>用户管理</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/teacherList.html" data-title="教师管理" data-icon="fa fa-gears">
                                                <i class="fa fa-gears"></i>
                                                <cite>教师管理</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/studentList.html" data-title="学生管理" data-icon="fa fa-file-text">
                                                <i class="fa fa-file-text"></i>
                                                <cite>学生管理</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/scores.html" data-title="成绩录入" data-icon="fa fa-dot-circle-o">
                                                <i class="fa fa-dot-circle-o"></i>
                                                <cite>成绩录入</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/evaluateList.html" data-title="学情分析" data-icon="fa fa-calendar">
                                                <i class="fa fa-calendar"></i>
                                                <cite>学情分析</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/sourceEvaluate.html" data-title="生源分析" data-icon="fa fa-hourglass-end">
                                                <i class="fa fa-hourglass-end"></i>
                                                <cite>生源分析</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="../usr/page/courseList.html" data-title="班级管理" data-icon="fa fa-snowflake-o">
                                                <i class="fa fa-snowflake-o"></i>
                                                <cite>班级管理</cite>
                                            </a>
                                        </div>
                                        <div class="layui-col-xs3 layuimini-qiuck-module">
                                            <a href="javascript:;" data-iframe-tab="http://www.zjtb.xyz/rs/" data-title="资料库" data-icon="fa fa-shield">
                                                <i class="fa fa-shield"></i>
                                                <cite>资料库</cite>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header"><i class="fa fa-line-chart icon"></i>报表统计</div>
                            <div class="layui-card-body">
                                <div id="echarts-records" style="width: 100%;min-height:500px"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-col-md4">

                <div class="layui-card">
                    <div class="layui-card-header"><i class="fa fa-bullhorn icon icon-tip"></i>系统公告</div>
                    <div class="layui-card-body layui-text">
                        <div class="layuimini-notice">
                            <div class="layuimini-notice-title">关于文件上传与下载</div>
                            <div class="layuimini-notice-extra">2020-01-25 10:06</div>
                            <div class="layuimini-notice-content layui-hide">
                                支持所有种类的文件上传<br>
                                可以支持ppt,mp3,mp4,docx文档,pdf等格式的下载<br>
                               应该能满足绝大部分的文件存储需求。<br>

                            </div>
                        </div>
                        <div class="layuimini-notice">
                            <div class="layuimini-notice-title">关于权限管理</div>
                            <div class="layuimini-notice-extra">2020-01-25  12:57</div>
                            <div class="layuimini-notice-content layui-hide">
                                权限管理模块并没有全部完成，只是在后台部分进行了用户的认证授权<br>
                              如果你想避免麻烦，那么在添加用户的时候为他/她赋予管理员角色即可<br>

                            </div>
                        </div>
                        <div class="layuimini-notice">
                            <div class="layuimini-notice-title">关于数据录入</div>
                            <div class="layuimini-notice-extra">2020-01-25 14:28</div>
                            <div class="layuimini-notice-content layui-hide">
                               每一个输入框都有相关的规范，<br>
                                为了确保数据的准确性，在输入时请注意提示<br>
                            </div>
                        </div>

                        <div class="layuimini-notice">
                            <div class="layuimini-notice-title">关于一些小错误</div>
                            <div class="layuimini-notice-extra">2020-01-25 11:55</div>
                            <div class="layuimini-notice-content layui-hide">
                               1.0版本，bug在所难免，无法提交工单，直接找我就成<br>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="layui-card">
                    <div class="layui-card-header"><i class="fa fa-fire icon"></i>版本信息</div>
                    <div class="layui-card-body layui-text">
                        <table class="layui-table">
                            <colgroup>
                                <col width="100">
                                <col>
                            </colgroup>
                            <tbody>
                            <tr>
                                <td>框架名称</td>
                                <td>
                                    layuimini+SpringBoot+SpringSecurity+Mybatis
                                </td>
                            </tr>
                            <tr>
                                <td>当前版本</td>
                                <td>v1.0.0</td>
                            </tr>
                            <tr>
                                <td>主要特色</td>
                                <td>零门槛 / 响应式 / 清爽 / 极简</td>
                            </tr>
                            <tr>
                                <td>项目地址</td>
                                <td>
                                    <a href="http://www.zjtb.xyz" target="_blank">点击查看</a><br>

                                </td>
                            </tr>
                            <tr>
                                <td>项目源码</td>
                                <td>
                                    <a href="https://github.com/HeNanFei/Version3.git" target="_blank">点击查看</a><br>

                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <div class="layui-card">
                    <div class="layui-card-header"><i class="fa fa-paper-plane-o icon"></i>作者心语</div>
                    <div class="layui-card-body layui-text layadmin-text">
                        <p>本系统基于layui2.5.4以及font-awesome-4.7.0进行实现。</p>
                        <p>技术交流QQ（872060821</p>
                        <p>喜欢此系统的可以给小张的GitHub加个Star支持一下</p>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<script src="../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
<script>
    var map;
    $(function () {
        $.ajax({
            url:'../../welcome/data',

            success:function (msg) {
                //layer.alert(msg);
                map = msg;
                // alert(JSON.stringify(map));

                $('#studentCount').append(msg.studentCount);
                $('#teacherCount').append(msg.teacherCount);
                $('#userCount').append(msg.userCount);
                $('#courseCount').append(msg.courseCount);
            },error:function () {
                alert('error');
            }
        })


        layui.use(['layer', 'layuimini','echarts'], function () {
            var $ = layui.jquery,
                layer = layui.layer,
                layuimini = layui.layuimini,
                echarts = layui.echarts;

            /**
             * 查看公告信息
             **/
            $('body').on('click', '.layuimini-notice', function () {
                var title = $(this).children('.layuimini-notice-title').text(),
                    noticeTime = $(this).children('.layuimini-notice-extra').text(),
                    content = $(this).children('.layuimini-notice-content').html();
                var html = '<div style="padding:15px 20px; text-align:justify; line-height: 22px;border-bottom:1px solid #e2e2e2;background-color: #2f4056;color: #ffffff">\n' +
                    '<div style="text-align: center;margin-bottom: 20px;font-weight: bold;border-bottom:1px solid #718fb5;padding-bottom: 5px"><h4 class="text-danger">' + title + '</h4></div>\n' +
                    '<div style="font-size: 12px">' + content + '</div>\n' +
                    '</div>\n';
                parent.layer.open({
                    type: 1,
                    title: '系统公告'+'<span style="float: right;right: 1px;font-size: 12px;color: #b1b3b9;margin-top: 1px">'+noticeTime+'</span>',
                    area: '300px;',
                    shade: 0.8,
                    id: 'layuimini-notice',
                    btn: ['取消'],
                    btnAlign: 'c',
                    moveType: 1,
                    content:html,

                });
            });

            /**
             * 报表功能
             */
            var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
            var optionRecords =  {
                color: ['#3398DB'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        data: map.edateList,
                        axisTick: {
                            alignWithLabel: true
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value'
                    }
                ],
                series: [
                    {
                        name: '学生人数',
                        type: 'bar',
                        barWidth: '60%',
                        data: map.countList
                    }
                ]
            };

            echartsRecords.setOption(optionRecords);

            // echarts 窗口缩放自适应
            window.onresize = function(){
                echartsRecords.resize();
            }

        });
    })




</script>
</body>
</html>
